<template>
  <div class="about-master-container">
    <base-breadcrumb>
      <searchData
        :search-data="searchArr"
        @search="search"
      />
      <a-card :bordered="false">
        <!-- <title-name title="索赔管理" /> -->
        <div>
          <a-button
            v-btn-permission="'lcm_005_add_02'"
            type="primary"
            icon="plus"
            @click="$nav('/legal/caseLawyerLetter/claimEstablishment/add')"
          >
            索赔立项
          </a-button>

          <excel
            ref="exportBtn"
            v-btn-permission="'lcm_005_exp_04'"
            file-name="西南公司索赔事项台账"
            is-click-generate="false"
          >
            <a-button
              slot="excelBtn"
              class="mb12"
              :loading="Export"
              @click="handleExport"
            >
              导出
            </a-button>
          </excel>
        </div>
        <list-table
          ref="table"
          :columns="columns"
          :request="loadData"
        >
          <template
            slot="status"
            slot-scope="text, record"
          >
            {{ record.status ? '销项' : '未销项' }}
          </template>
          <template
            slot="legalAuditStatusEnumStr"
            slot-scope="text, record"
          >
            <list-status2
              :status="record.legalAuditStatusEnum"
              :text="text"
            />
          </template>
          <template
            slot="action"
            slot-scope="text, record"
          >
            <MoreButton>
              <a
                v-btnPermission="'lcm_005_loo_01'"
                @click="$nav('/legal/caseLawyerLetter/claimEstablishment/details',{id:record.id})"
              >查看</a>
              <!--                            <span @click="$nav('/legal/caseLawyerLetter/claimEstablishment/add',{id:record.id})">编辑</span>-->

              <template
                v-if="(record.legalAuditStatusEnum === 'DRAFT' ||
                  record.legalAuditStatusEnum === 'REJECTEDS') && (record.isCreator)"
              >
                <a @click="$nav('/legal/caseLawyerLetter/claimEstablishment/add',{id:record.id})" v-if="hideBuquBtn()">编辑</a>
                <a @click="handleDel(record.id)" v-if="hideBuquBtn()">删除</a>
              </template>
              <template
                v-if="record.legalAuditStatusEnum === 'PAST'|| record.legalAuditStatusEnum === 'WRITESUBMITTED'"
              >
                <a
                  v-if="record.isCreator"
                  @click="$nav('/legal/caseLawyerLetter/claimEstablishment/advanceRecord',{id:record.id})"
                >
                  推进记录
                </a>
                <!-- isAddMember：判断是否已经添加索赔小组成员（true：是，false：不是） -->
                <a
                  v-if="record.legalAuditStatusEnum === 'PAST'&& hideBuquBtn()"
                  v-btn-permission="'lcm_005_pz_03'"
                  @click="$nav('/legal/caseLawyerLetter/claimEstablishment/add',{id:record.id,isComment:1})"
                >
                  批注
                </a>
                <a
                  v-if="(record.isCreator && (!record.isAddMember)) && hideBuquBtn()"
                  @click="claimPanel(record)"
                >索赔小组</a>
              </template>
              <template
                v-if="record.legalAuditStatusEnum === 'PAST' ||
                  record.legalAuditStatusEnum === 'REJECTED' ||
                  record.legalAuditStatusEnum === 'WRITESUBMITTED'"
              >
                <a
                  v-if="record.isCreator && record.isAddMember"
                  @click="chooseRow = record;visible = true"
                >销项</a>
              </template>
              <approval-button
                v-if="record.legalAuditStatusEnum !== 'DRAFT'"
                :id="record.id"
              />
            </MoreButton>
          </template>
          <template
            slot="expandedRowRender"
            slot-scope="record"
          >
            <p>索赔事项：<span>{{ record.claims }}</span></p>
            <p>索赔原因：<span>{{ record.claimReason }}</span></p>
          </template>
        </list-table>
      </a-card>
      <out-put2
        :visible.sync="visible"
        title="索赔销项"
        :row="chooseRow"
        :submit-func="submitFunc"
        @ok="$refs.table.getData(null,true)"
      />

      <SelectPerson
        :visible.sync="claimsPanelMemberVisible"
        title="选择索赔小组成员"
        :org-query="orgQuery"
        :list.sync="claimsPanelMember"
        @getSelectPerson="getSelectPerson"
      />
      <!-- :need-data="isPD" -->
    </base-breadcrumb>
  </div>
</template>

<script>
import {
    getClaimEstablishment,
    postClaimEstablishmentOutput, deleteByClaim, addMember
} from '@/api/legal'
import SelectSubCompany from '@/components/Select/SelectSubCompany' // 分公司
import SelectProject from '@/components/Select/SelectProject' // 项目
import OrgTreeSelect from '@/components/OrgTreeSelect'
import OutPut2 from '../outPut2'
import list_status2 from '@/components/list_status2/list_status2'
import SelectPerson from '@/components/Select/SelectPerson'

export default {
  name:'a'+Date.now(),
  data() {
        return {
            claimsPanelMemberVisible: false,
            claimsPanelMember: [],
            queryParam: {},
            form: {},
            loadData: (parameter) => {
                const searchData = Object.assign({}, parameter, this.getParams())
                return getClaimEstablishment(searchData)
            },
            searchArr: [
                // 搜索框
                {
                  name: '所属单位',
                  valueKey: 'searchQuery',
                  type: OrgTreeSelect,
                },
                // {
                //     name: '所属分公司',
                //     type: SelectSubCompany,
                //     valueKey: 'branchCompanyId'
                // },
                // {
                //     name: '项目名称',
                //     type: SelectProject,
                //     valueKey: 'projectId'
                // },
                {
                    name: '索赔事项',
                    value: 'claims',
                    type: 'input'
                },
                {
                    name: '立项时间',
                    value: 'rogerThatTime',
                    type: 'dateRange',
                    attr: {
                        valueFormat: 'YYYY-MM-DD'
                    }
                },
                {
                    name: '索赔原因',
                    value: 'claimsReason',
                    type: 'input'
                },
                {
                    name: '预计索赔金额(万元)',
                    value: 'estimatedClaimAmount',
                    type: 'rangeInput',
                    setInitValue: true,
                    // initValue: undefined,
                    attr: {
                      rangeFormat: ['estimatedClaimStartAmount', 'estimatedClaimEndAmount'],
                      min: 0,
                      precision: 2
                    }
                },
                {
                    name: '索赔立项人',
                    value: 'projectSponsor',
                    type: 'input'
                }
            ],
            columns: [
                {
                    title: '所属分公司',
                    ellipsis: true,
                    dataIndex: 'branchCompany'
                },
                {
                    title: '项目名称',
                    ellipsis: true,
                    dataIndex: 'projectName',
                    minWidth: '400px'
                },
                {
                    title: '立项人',
                    ellipsis: true,
                    dataIndex: 'projectSponsor',
                    minWidth: '80px'
                },
                {
                    title: '电话号码',
                    ellipsis: true,
                    dataIndex: 'phone'
                },
                {
                    title: '立项人职务',
                    ellipsis: true,
                    dataIndex: 'proposalPersonPosition',
                    minWidth: '400px'
                },
                {
                    title: '预计索赔金额(万元)',
                    ellipsis: true,
                    dataIndex: 'estimatedClaimAmount'
                },
                {
                    title: '立项时间',
                    width: '110px',
                    ellipsis: true,
                    dataIndex: 'projectTime'
                },
                {
                    title: '状态',
                    dataIndex: 'legalAuditStatusEnumStr',
                    width: '134px',
                    ellipsis: true,
                    scopedSlots: { customRender: 'legalAuditStatusEnumStr' }
                },
                {
                    title: '操作',
                    width: '180px',
                    fixed: 'right',
                    scopedSlots: { customRender: 'action' }
                }
            ],
            visible: false,
            Export: false,
            chooseRow: null,
            submitFunc: postClaimEstablishmentOutput
        }
    },
    components: {
        'list-status2': list_status2,
        OutPut2,
        SelectPerson
    },
    created() {
    },
    computed: {
      currentPost() {
        return this.$userInfo().currentPost;
      },
      isPD() {
        return this.currentPost.code == 'PD'
      },
      orgQuery() {
        return {
          // pid: this.currentPost.id,
          pid: this.chooseRow?.projectDeptOrgId,
          containParent: 0
        }
        // return this.isPD ? {
        //   pid: this.currentPost.id,
        //   containParent: 0
        // } : {}
      }
    },
    methods: {
        getParams() {
          const params = { ...this.queryParam };
          if (params.rogerThatTime?.length > 0) {
              params.projectStartTime = params.rogerThatTime[0] + ' 00:00:00'
              params.projectEndTime = params.rogerThatTime[1] + " 23:59:59"
              delete params.rogerThatTime
          }
          if (params.estimatedClaimAmountEnd != undefined) {
              params.estimatedClaimEndAmount = params.estimatedClaimAmountEnd
              delete params.estimatedClaimAmountEnd;
          }
          if (params.estimatedClaimAmountStart != undefined) {
            params.estimatedClaimStartAmount = params.estimatedClaimAmountStart || 0
            delete params.estimatedClaimAmountStart;
          }
          return params;
        },
        claimPanel(record) {
          this.chooseRow = record;
          this.claimsPanelMember = [];
          this.claimsPanelMemberVisible = true;
        },
        getSelectPerson(list) {
          this.claimsPanelMemberVisible = true;
          let _this = this;
          this.$confirm({
            title: '温馨提示',
            content: '请确认是否要提交，提交后不可修改',
            onOk() {
              return new Promise((resolve, reject) => {
                const claimsPanelMember = list.map((item, index) => {
                    return { name: item.name, id: item.userId }
                  })
                const param = {
                  id: _this.chooseRow.id,
                  claimsPanelMember: claimsPanelMember
                }
                addMember(param).then((res) => {
                  if (res.code == 200) {
                    resolve();
                    _this.$message.success('添加成功');
                    _this.$refs.table.getData(null, true);
                    _this.claimsPanelMemberVisible = false;
                  } else {
                    reject();
                  }
                })
                // setTimeout(() => {
                //   resolve()
                // }, 2000)
              })
            }
          })
        },
        handleDel(id) {
            this.$delList2(deleteByClaim, () => {
                this.$refs.table.getData(null, true)
            }, { ids: [id] })
        },
        search(val) {
            val && (this.queryParam = val)
            this.$refs.table.getData(null, true)
        },
        handleExport() {
          try {
            if (this.Export) return
            this.Export = true;
            const params = Object.assign({ needCount: false }, this.getParams());
            getClaimEstablishment(params).then((res) => {
              this.Export = false
              if (res && res.code == 200) {
                const list = res.data.map((item, index) => {
                  item.serial = (index + 1);
                  return item;
                });
                const columns = [
                {
                    title: '',
                    dataIndex: ''
                },
                {
                    title: '序号',
                    dataIndex: 'serial'
                },{
                    title: '所属分公司',
                    dataIndex: 'branchCompany'
                },
                {
                    title: '所属项目',
                    dataIndex: 'projectName'
                },
                {
                    title: '索赔事项',
                    dataIndex: 'claims'
                },
                {
                    title: '预计索赔金额(万元)',
                    dataIndex: 'estimatedClaimAmount'
                },
                {
                    title: '索赔原因',
                    dataIndex: 'claimReason'
                },
                {
                    title: '状态',
                    dataIndex: 'legalAuditStatusEnumStr',
                },
                {
                    title: '立项人',
                    dataIndex: 'projectSponsor'
                },
                {
                    title: '立项人职务',
                    dataIndex: 'proposalPersonPosition'
                },
                {
                    title: '立项时间',
                    width: '110px',
                    dataIndex: 'projectTime'
                },
                {
                    title: '销项时间',
                    dataIndex: 'destroyedTime'
                },
                {
                    title: '销项说明',
                    dataIndex: 'salesDescription'
                }]
                this.$refs.exportBtn.generateExcel(list, { columns })
              }
            }).catch(() => {
              this.Export = false
            })
          } catch (e) {
            console.error(e)
            this.Export = false
          }
        }
    }
}
</script>


<style lang="less" scoped>
/deep/ .table-page-search-wrapper .ant-form-inline .ant-form-item > .ant-form-item-label {
    min-width: 90px;
}

/deep/ .ant-table-thead > tr > th,
.ant-table-tbody > tr > td {
    padding: 10px;
}
/deep/ .ant-table-fixed-right .ant-table-expanded-row {
  height: 80px;
}
</style>
